<template>
	<view class="off_port" v-if="reportDetail">
		<view class="work_head flex_row al_center">
			<view class="flex_col flex_1 al_center">
				<view class="flex_col head_item">
					<text>我的工作</text>
					<text>司机</text>
				</view>
			</view>
			<view class="head_line"></view>
			<view class="flex_col flex_1 al_center">
				<view class="flex_col head_item">
					<text>汇报时间</text>
					<text>{{reportTime}}</text>
				</view>
			</view>
		</view>
		<!-- <view class="full_width pd_bt_20 pd_tp_30">
			<text class="status_txt">健康状况</text>
		</view>
		<text class="health_status">{{reportDetail.healthStatus}}</text> -->
		
		
		<view class="report_list flex_col al_center mg_tp_10">
		
			<view class="report_item flex_row al_center">
				<text class="report_name form_lable">车牌号</text>
				<text class="flex_1 report_input">{{reportDetail.plateNo}}</text>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name form_lable" :style="{width:'300rpx'}">仪表盘当前公里数</text>
				<text class="flex_1 report_input">{{reportDetail.startMileage}}</text>				
				<text  class="report_value pd_rt_10" :style="{color:'#909090'}">Km</text>
				<!-- <input type="number" v-model="startMileage" class="flex_1 report_input" placeholder="请输入"/> -->
				<!-- item.startKm -->
			</view>
			<!-- <view class="report_item flex_row just_space_between al_center">
				<text class="report_name">按交规驾驶</text>
				<view class="flex_row al_center" @tap="toast">
					<text class="report_value" :style="{color:'#333'}">{{reportDetail.safety.safeDrive}}</text>
				</view>
			</view> -->
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name form_lable">轮胎气压</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.tirePressure}}</text>
				</view>
				<!-- <text class="flex_1 report_input">{{reportDetail.safety.tirePressure}}</text> -->
				<!-- <text class="report_value pd_rt_10" :style="{color:'#909090'}">KPA</text> -->
			</view>
			
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">发动机</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.engineState}}</text>
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">车门</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.carDoorState}}</text>
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">水箱</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.waterTankState}}</text>
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">机油</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.engineOilState}}</text>
					
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">刹车与制动</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.brakeStopState}}</text>
				</view>
			</view>
		</view>
	
	</view>
</template>

<script>
	export default {
		data() {
			return {
				section:'',
				plateNumber:'',
				
				// 质量
				rubbishfull:'有',
				rubbish:'有',
				taxevasion:'有',
				dailytransportation:'有',
				cleanbody:'有',
				explain:'',
				
				
				//其他
				pressure:'正常',
				engine:'正常',
				cardoor:'已锁',
				waterTank:'正常',
				engineOil:'正常',
				brake:'正常',
				
				calculate:'',
				refuelingTime:'',
				quantity:'',
				category:null,
				engineOptions:[{text:'正常'},{text:'异常'}],
				cardoorOptions:[{text:'已锁'},{text:'未锁'}],
				thereany:[{text:'有'},{text:'没有'}],
				categorys:[{text:'收运司机'},{text:'清运司机'},{text:'保洁司机'}],
				numList1:[{num:'1次'},{num:'2次'},{num:'3次'},{num:'4次'},{num:'5次'},{num:'6次'}],
				numList2:[{num:'1分'},{num:'2分'},{num:'3分'},{num:'4分'},{num:'5分'},{num:'6分'},{num:'7分'},{num:'8分'},{num:'9分'},{num:'10分'},{num:'11分'},{num:'12分'}],
				taskList:[{startTime:'',endTime:'',startKm:'',endKm:'',barrels:'',amount:''}],
				violations:[{illegalItems:'闯红灯',frequency:'1次',branch:'1分'}],
				traffRules:[{text:'闯红灯'},{text:'超速'},{text:'逆向行驶'},{text:'违停'},{text:'抢人行道'}]
			}
		},
		computed:{
			reportTime:function(){
				if(this.reportDetail){
					return this.$utils.format(new Date(this.reportDetail.createTime),'yyyy-MM-dd hh:mm')
				}
			}
		},
		props:{
			reportDetail:{
				type:Object,
				default:()=>{
					return {}
				}
			}
		},
		methods: {
			changeCardoor(e){
				this.cardoor = this.cardoorOptions[e.detail.value].text
			},
			changenormal(e,name){
				switch(name){
					case 0:this.pressure = this.engineOptions[e.detail.value].text; break;
					case 1:this.engine = this.engineOptions[e.detail.value].text; break;
					case 2:this.waterTank = this.engineOptions[e.detail.value].text; break;
					case 3:this.engineOil = this.engineOptions[e.detail.value].text;  break;
					case 4:this.brake = this.engineOptions[e.detail.value].text;  break;
				}
			},
			changeHave(e,name){
				switch(name){
					case 0:this.rubbish = this.thereany[e.detail.value].text; break;
					case 1:this.taxevasion = this.thereany[e.detail.value].text; break;
					case 2:this.dailytransportation = this.thereany[e.detail.value].text; break;
					case 3:this.cleanbody = this.thereany[e.detail.value].text;  break;
					case 4:this.rubbishfull = this.thereany[e.detail.value].text;  break;
				}
			},
			selectCate(e){
				this.category = this.categorys[e.detail.value].text
			},
			changeVal(e,dom,type,index){
				if(type===0){
					this.$set(this.violations[index],dom,this.traffRules[e.detail.value].text)
				}
				if(type===1){
					this.$set(this.violations[index],dom,this.numList1[e.detail.value].num)
				}
				if(type===2){
					this.$set(this.violations[index],dom,this.numList2[e.detail.value].num)
				}
				
			},
			addVoTimes(){
				this.violations.push({illegalItems:'闯红灯',frequency:'1次',branch:'1分'})
			},
			addTimes(){
				this.taskList.push({startTime:'',endTime:'',startKm:'',endKm:'',barrels:'',amount:''})
			},
			deleteTimes(index){
				this.$delete(this.taskList,index)
			},
			deleteviolations(ind){
				this.$delete(this.violations,ind)
			},
			changesTime(e,ind){
				this.$set(this.taskList[ind],'startTime',e.detail.value)
				//
			},
			changeEtime(e,ind){
				this.$set(this.taskList[ind],'endTime',e.detail.value)
				//
			},
			back(){
				this.$utils.navBack()
			}
		}
	}
</script>

<style scoped>
@import "@/common/css/main.css";
.off_port{
	width: 750rpx;
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: center;
	background:#F6F6F6 ;
}
.work_head{
	width:750rpx;
	height:140rpx;
	background:#fff;
}
.head_line{
	width:1px;
	height:44rpx;
	background:#D7D7D7;
}
.head_item text:nth-child(1){
	font-size:30rpx;
	font-weight:500;
	color:#868686;
}
.head_item text:nth-child(2){
	margin-top: 10rpx;
	font-size:34rpx;
	font-weight:bold;
	color:#454545;
}
.status_txt{
	margin-left: 40rpx;
	font-size:32rpx;
	font-weight:500;
	color:#909090;
}
.health_status{
	width: 750rpx;
	height: 80rpx;
	background: #fff;
	padding-left: 40rpx;
	padding-top: 20rpx;
	font-size: 32rpx;
	box-sizing: border-box;
}
.report_item{
	width: 690rpx;
	height: 120rpx;
	border-bottom: 1px solid #E8E8E8;
}
.report_name{
	font-size: 32rpx;
	color: #2E2D2D;
	font-weight: 500;
}
.report_value{
	font-size: 32rpx;
	color: #909090;
	font-weight: 500;
}
.report_list{
	width: 750rpx;
	background-color: #fff;
}
.two_btn{
	width: 750rpx;
	height: 130rpx;
	margin-top: 40rpx;
	text-align: center;
	background-color: #fff;
}
.draft_btn{
	margin-left: 34rpx;
	margin-top: 20rpx;
	width:200rpx;
	height:96rpx;
	background:#26AE6C;
	border-radius:10rpx;
	
}
.draft_btn text{
	font-size:32rpx;
	font-weight:bold;
	color:#fff;
}
.submit_btn{
	width:466rpx;
	height:76rpx;
	background:#345AD4;
	border-radius:10rpx;
	margin: 0 auto;
}
.submit_btn text{
	font-size:32rpx;
	font-weight:bold;
	color:#fff;
}


.form_lable{
	width: 200rpx;
}
.report_input{
	font-size: 32rpx;
}
</style>
